<template>
  <div class="profit">
    <div class="header">
      <div class="header-title">收益明细</div>
    </div>
    <!-- <van-pull-refresh
      v-model="Refresh"
      @refresh="onLoad"
      success-text="刷新成功"
      class="margin"
    > -->
    <div class="margin">
    <wallet v-if="!Refresh"/>
    <detailed v-if="!Refresh"/></div>
    <!-- </van-pull-refresh> -->
    <NavBar />
    
  </div>
</template>
<script>
import NavBar from "@/components/home/NavBar";
import wallet from "@/components/profit/index/wallet";
import detailed from "@/components/profit/index/detailed";
import { reactive, toRefs } from 'vue';

export default {
  components: {
    NavBar,
    wallet,
    detailed,
  },
  setup(){
    const data=reactive({
      Refresh: false,
    });
    const onLoad=()=>{
        data.Refresh=false;
    }
    return {...toRefs(data),onLoad}
  }
};
</script>

<style lang="scss" scoped>
@import "@/common/style/mixin";
.profit {
  font-size: 1.3rem;
  letter-spacing: 0.75px;
  background: linear-gradient(180deg, $green 10%, #fff 70%);
  height: 100vh;
  overflow: auto;
}
.header{
      position: fixed;
    right: 0;
    height: 5rem;
    width: 100vw;
    z-index: 10;
    top: 0;
    background: $green;
    line-height: 5rem;
}
.header-title{
  font-size: 2rem;
  font-weight: 600;
    color: #fff;
    margin-bottom: 2rem;
}
.margin{
  margin: 7rem 0 8rem;
}
</style>
